import type { SoElements } from '../../../../../../../../types/constants/personalization/so'
import { ThemeVarService } from '../../../../../../../../lib/abstract/style/theme_var/service'
import {
  AppStyleCollections,
  generateHideSelector,
  PAGE_ELEMENTS,
  SUPPORTED_PLATFORMS,
} from '../../../../../../../../types/constants'
import { SoCommonPage } from './common'

export class SoIndexSearchPage {
  elements: SoElements = PAGE_ELEMENTS[SUPPORTED_PLATFORMS.SO]
  private static instance: SoIndexSearchPage
  private readonly themeVarService: ThemeVarService = ThemeVarService.getInstance()
  private readonly commonPage: SoCommonPage = SoCommonPage.getInstance()

  /**
   * 获取单例实例
   */
  public static getInstance(): SoIndexSearchPage {
    if (!SoIndexSearchPage.instance) {
      SoIndexSearchPage.instance = new SoIndexSearchPage()
    }
    return SoIndexSearchPage.instance
  }

  init(): void {
  }

  hideSearchStyles(): string {
    return `
    .ac_wrap {
      display: none !important;
    }
    
    #suggest-align {
      border-radius: 8px 0 0 8px !important;
    }
    `
  }

  getMainStyles(): string {
    return `
/* 隐藏样式 */    
.page-wrap #header:has(${generateHideSelector('#bd_tabnav')}):has(${generateHideSelector('#so_weather')}):has(${generateHideSelector('#hd_nav')}) {
  background: transparent !important;
}
.page-wrap #header:not(:has(${generateHideSelector('#bd_tabnav')})):has(${generateHideSelector('#so_weather')}):has(${generateHideSelector('#hd_nav')}) {
  justify-content: center !important;
}
.page-wrap #header:has(${generateHideSelector('#so_weather')}) {
  #hd_nav {
    margin-left: auto !important;
  }
}

/* 搜索历史隐藏、搜索建议隐藏 */
&[${AppStyleCollections.Search.attr.HIDE_HISTORY}="true"][${AppStyleCollections.Search.attr.HIDE_SUGGESTIONS}="true"] {
  form {
    ${this.hideSearchStyles()}
  }
}
/* 搜索历史隐藏、搜索建议显示 */
&[${AppStyleCollections.Search.attr.HIDE_HISTORY}="true"]:not([${AppStyleCollections.Search.attr.HIDE_SUGGESTIONS}]) {
  /* 无搜索建议 */
  form[${AppStyleCollections.Search.attr.IS_SUGGESTIONS_EMPTY}="true"] {
    ${this.hideSearchStyles()}
  }
}
/* 搜索历史显示、搜索建议隐藏 */
&:not([${AppStyleCollections.Search.attr.HIDE_HISTORY}])[${AppStyleCollections.Search.attr.HIDE_SUGGESTIONS}="true"] {
  /* 无搜索历史 */
  form[${AppStyleCollections.Search.attr.IS_HISTORY_EMPTY}="true"] {
    ${this.hideSearchStyles()}
  }
}

/* 主样式 */
.page-wrap {
  /* 顶部菜单*/
  #header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    background: var(${this.themeVarService.search.header.background}) !important;
    padding: 24px 0 !important;
    
    #bd_tabnav {
      order: 1 !important;
      float: unset !important;
      margin: unset !important;
      margin-right: auto;
      margin-left: 0;
      
      .skin-text-tab {
        a {
          color: var(${this.themeVarService.search.default.text}) !important;
          
          &:hover {
            color: var(${this.themeVarService.tab.textHover}) !important;
          }
        }
      }
    }
    
    #hd_nav {
      li {
        a {
          color: var(${this.themeVarService.search.default.text}) !important;
        }
        
        &:hover {
          a {
            color: var(${this.themeVarService.link.default.text}) !important;
          }
        }
      }
    }
    
    #so_weather {
      order: 2 !important;
      float: unset !important;
      margin-left: auto !important;
      top: unset !important;
      padding-top: 1px !important;
      
      .bar {
        display: flex !important;
        align-items: center !important;
        
        .pos_weather {
          display: inline-flex !important;
          align-items: center !important;
          
          img {
            top: unset !important;
          }
          
          span {
            color: var(${this.themeVarService.search.default.text}) !important;
            display: inline-flex !important;
            align-items: center !important;
            
            &:hover {
              color: var(${this.themeVarService.message.success.textPrimary}) !important;
            }
          }
        }
      }
    }
    
    #hd_nav {
      order: 3 !important;
      float: unset !important;
      top: unset !important;
      margin-left: 0 !important;
    }
  }
  
  /* 主内容 */
  #main {
    #bd_search {
      .fixed {
        background-color: transparent !important;
        display: inline-flex !important;
        opacity: 1 !important;
      }
      
      form {
        display: inline-flex !important;
        align-items: center !important;
        width: fit-content !important;
        gap: 10px !important;
        
        .fixed-logo {
          margin-left: 0 !important;
          position: relative !important;
          top: unset !important;
          left: unset !important;
          opacity: 1 !important;
        }
        
        #input-container {
          margin-left: 0 !important;
          
          .ac_wrap .ac_menu > li {
            font-size: ${this.themeVarService.search.default.fontSize} !important;
            
            /* 搜索建议高亮 */
            span {
              &:has(b) {
                color: var(${this.themeVarService.em.text}) !important;
              }
            }
          }
        }
      }
    }
    
    #card_container {
      background-color: transparent !important;

      /* 实时热搜 */
      .hot-news-card {
        #res_news_flow {
          .top-tab {
            a, a span {
              color: var(${this.themeVarService.search.default.text}) !important;
            }
          }
          
          .focus-top-txt {
            color: var(${this.themeVarService.message.error.textPrimary}) !important;
          }
          
          .focus-top-title {
            color: var(${this.themeVarService.search.default.text}) !important;
          }
          
          ul {
            li {
              position: relative !important;
              background: var(${this.themeVarService.search.resultItem.background}) !important;
              box-shadow: var(${this.themeVarService.search.resultItem.shadow}) !important;
              border-radius: ${this.themeVarService.search.resultItem.borderRadius} !important;
              padding: 15px !important;
              margin-bottom: 15px !important;
              
              p {
                &.sub-title {
                  color: var(${this.themeVarService.search.default.text}) !important;
                }
              }
            }
          }
        }
        
        #card_side {
          .list .item a {
            color: var(${this.themeVarService.link.default.text}) !important;
            
            &:hover {
              color: var(${this.themeVarService.link.default.textHover}) !important;
              text-decoration: none !important;
            }
          }
          
          .more {
            border: none !important;
            color: var(${this.themeVarService.link.default.text}) !important;
            
            &:hover {
              color: var(${this.themeVarService.link.default.textHover}) !important;
            }
          }
        }
      }
    }
  }
  
  /* 页脚 */
  ${this.commonPage.footStyles()}
  #footer {
    position: unset !important;
  }
}
`
  }
}
